<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, shrink-to-fit=no, viewport-fit=cover">
    <!--    <meta content="telephone=no" name="format-detection">-->
    <meta name="google" value="notranslate">
    <meta name="root-url" value="">
    <meta http-equiv="x-dns-prefetch-control" content="on">
    <meta property="title" content="">
    <meta property="key" content="">
    <meta property="description" content="">
    <title>拼宠宠-首页</title>
    <link rel="stylesheet" href="css/swiper.min.css">
    <link rel="stylesheet" href="css/app-base.css">
    <link rel="stylesheet" href="css/app-main.css">
    <script type="text/javascript" src="js/zepto.js"></script>
    <script type="text/javascript" src="js/zepto.min.js"></script>
    <script type="text/javascript" src="js/common.js"></script>
    <script src="js/_config.json"></script>
</head>
<body>
<style>
    .pro_type_grid .pro_item{
        width: calc(50% - .21rem * 2);
    }
    .header-search-txt{
        padding-left: 24px;
padding-right: 10px;
        width: 100%;
        background: #dddcdc;
       /* margin-left: 10px;
        margin-right: 10px;*/
        height: 30px;
        border-radius: 50px;
    }
    .page-header-background.header-title{
        text-align: center;
        color: #fff;
        font-size: 14px;
        font-weight: bold;
        line-height: 44px;
    }
    .pro_item .cover .photo{
        height:30px !important
    }
    .pro_item .cover{
        text-align: center;
    }
    .pro_item .item_inner{
        display: grid;
        grid-template-rows: auto auto;
        margin-bottom: 5px;
        background: #fff;
        padding-top: 20px;
        padding-bottom: 20px;
        height: 55px;
    }
    .pro_item div{
        text-align: center;
        font-size: 13px;
    }
    body{
        background: #eee;
        height: 100%;
    }
    .pro_item{
        display: grid;
grid-template-columns: auto auto;
grid-column-gap: 5px;
    }
    .page-header-background.header-title{
        background: #40af41;
    }
    .p1{
        padding-left: 10px;
padding-right: 10px;
padding-bottom: 10px;
background: #fff;
padding-top: 6px;
margin-top: -6px;
    }
    .p2{
        margin-left: 10px;
margin-right: 10px;
font-size: 10px;
text-align: center;
margin-bottom: 10px;

    }
    .c1{
        color: #888;
    }
    .d3{
        margin-bottom: 10px;
margin-top: 10px;
    }
    .d4{
        text-align: center;
        margin-bottom: 75px;
        position: fixed;
bottom: 0px;
width: 100%;
    }
    .but-lx{
    border: none;
width: 70%;
background: #f08818;
color: #fff;
line-height: 30px;
  border-radius: 50px;
  font-size: 12px;
}
.swiper-pagination-bullet.swiper-pagination-bullet-active{
    background: #40af41 !important;
}
.swiper-pagination-bullet{
    width: 5px !important;
height: 5px !important;
border-radius: 50px !important;
background: #888 !important;
}
.fb.fb-user{
    background-image: url(../images/user2.png) !important;
    background-position: 0 0 !important;
}
.fb.fb-home{
    background-image: url(../images/home2.png) !important;
    background-position: 0 0 !important;
}
.nav-controller{
    color:#888 !important
}
.nav-controller.active{
    color:#40af41 !important
}
.header-search-txt::placeholder{
    font-size: 10px;
}

.header-search-txt{
    font-size: 10px;
}
.footer{
    height: 44px;
}
.index-thousands{
    margin:13px;
}
.index-thousands .pro_item{
/*    background: #fff !important;*/
border-radius: 0px !important;
display: grid !important;
grid-template-columns: auto auto !important;
grid-column-gap: 8px !important;
grid-row-gap: 3px !important;
}
.pro_list.pro_type_scroll{
    margin-bottom: 0px !important;
}
body{
    background: #cecece;
}
.dd{
    margin-bottom: -10px;
}
.pro_item .cover{
    margin-top: -5px;
}

.p2.c1{
    margin-bottom: 70px;
}
.page-header-background.header-title{
    position: fixed;
top: 0px;
width: 100%;
z-index: 999;
}
#content{
    margin-top: 44px;
}
</style>

<div id="content" class="">
    <div class="">
        <div class="page-header-background header-title">
            拼宠宠
        </div>
        <div class="page-header-background banner" >
            <div class="swiper-container index-banner swiper-container-horizontal">
                <div class="swiper-wrapper" >
                                                <a class="swiper-slide" href='' >
                                <img class="swiper-lazy swiper-lazy-loaded" src="images/cwlb.png">
                            </a>
                                                    <a class="swiper-slide" href='' >
                                <img class="swiper-lazy swiper-lazy-loaded" src="images/cwlb2.png">
                            </a>
                                        </div>
                <div class="swiper-pagination swiper-pagination-clickable swiper-pagination-bullets" slot="pagination">
                                            <span class="swiper-pagination-bullet" ></span>
                                            <span class="swiper-pagination-bullet" ></span>
                                    </div>
            </div>
        </div>




    

        <div class="p1">
            <div class="" style="position: relative;">
                <input name="keyword" id="search" type="search" placeholder="查找订单" class="header-search-txt">
                <img style="position: absolute;top: 10px;left: 7px;height: 10px;" src="images/search.png">
            </div>
            
                  
        </div>
        
        <div class="index-thousands">
            <div class="index-thousands-title">
                
                <div class="index-activity">
                                                
                        
                    <div class="activity-list">
                        <div class="pro_list pro_type_scroll">
                            <div class="pro_item">
                                <a class="item_inner 6" href="guoji.html">

                                    <div class="cover" >
                                        <img style="height: 35px !important;" class="photo" src="images/fj.png" >
                                    </div>
                                    <div class="dd">国际业务</div>
                                </a>
                                <a class="item_inner 7"  href="xiadan.html">
                                    <div class="cover" >
                                        <img style="height: 35px !important;" class="photo" src="images/gwc.png" >
                                    </div>
                                    <div class="dd">立即下单</div>
                                </a>
                                <a class="item_inner 7" href="yunfei.html">
                                    <div class="cover" >
                                        <img style="height: 35px !important;" class="photo" src="images/cx.png" >
                                    </div>
                                    <div class="dd">运费查询</div>
                                </a>
                                <a class="item_inner 7" href="dingdan.html">
                                    <div class="cover" >
                                        <img style="height: 35px !important;" class="photo" src="images/wb.png" >
                                    </div>
                                    <div class="dd">我的订单</div>
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
      
    </div>
    
</div>
<div class="p2 c1">
    <div class="d3">宠物专车，全程空调，专人照顾，保障宠物旅途安全！</div>
    <div>客服工作时间：9:00~18:00，若有回复不及时，请耐心等待，客服会在上班后第一时间联系您！</div>
</div>

<div class="d4">
    <button class="but-lx">联系客服</button>
</div>

<script type="text/javascript" src="js/swiper.min.js"></script>
<script>



    document.addEventListener('keydown',function(e){
        if (e.keyCode=="13") {
            window.location.href=siteConfig.BaseUrl+"/dingdan.html?key="+document.getElementById("search").value;
        }
    })


    var page = 1;
    var pages = 0;
    $(document).ready(function () {

        var mySwiper = new Swiper ('.swiper-container', {
            direction: 'horizontal',  //轮播方向
            autoplay:2000,  //自动轮播
            loop: true,   //循环
            // 如果需要分页器

            //小圆点
            pagination: '.swiper-pagination',
            paginationClickable: true,

            autoplayDisableOnInteraction : false  //用户操作后不停止
        });
        ajax_goods();

    })
    // 回到顶部
    $('.app-go-top').off().on('click', function(e) {
        $('html, body').scrollTop(0);
        e.preventDefault();
    });

    // 页面滚动相关
    $(document).on('scroll', function() {
        var scrollTop = document.documentElement.scrollTop | document.body.scrollTop;

        // 滑动到底加载更多
        var iElem = $('.content-list');
        if (iElem.length) {
            var cHeight = window.innerHeight;
            var iHeight = $(document).height();
            var iPosition = iElem.position().top;

            var tHeight = scrollTop + iPosition;
            if (cHeight + scrollTop + 50 > iHeight) {
                loadmore();
            }
        }

        // 回到顶部
        var iGoTop = $('.app-go-top');
        if (iGoTop.length) {
            if (scrollTop > 300) {
                if (!iGoTop.hasClass('show')) {
                    iGoTop.addClass('show');
                }
            } else {
                iGoTop.removeClass('show');
            }
        }

        // 产品页面切换置顶
        var sticky = $('#header-sticky');
        var fiexd = $('#sticky-warp');
        if (sticky.length && fiexd.length) {
            scrollTop >= sticky.offset().top ? fiexd.addClass('fixed') : fiexd.removeClass('fixed');
        }
    });
    // 加载更多页
    loadmore = function() {
        if (page <pages) {
            if (!$('.page-content').find('.loading-more').length) {
                $('<div />').addClass('loading-more').html('<i></i>').appendTo($('.page-content'));
                ajax_goods();
            }
        }
    }

    ajax_goods = function(){
        $.get("goods/ajaxGoodsList", {  'page':page,}, function (res) {
            var res = JSON.parse(res);
            console.log(res)

            if(res.status == 1){
                let data = res.data.data;
                let html = '';
                for(var index in data){
                    let goods_url = '/home/goods/goods_info/goods_id/' + data[index].goods_id + '.html';
                    let pingou = '';
                    if(data[index].prom_type == 6){
                        goods_url = '/home/team/goods_info/team_id/' + data[index].prom_id + '.html';
                        pingou = '<div class="item_stamp bg_red">拼购</div>';
                    }
                    //其实index 就是个索引

                    html += ' <div class="pro_item">\n' +
                        '            <a class="item_inner" href="'+goods_url+'">\n' +
                        '                <div class="cover">\n' +
                        '                    <img class="photo" src="'+data[index].thumb_url+'">\n' +pingou+
                        '                </div>\n' +
                        '                <div class="info">\n' +
                        '                    <div class="title">\n' +
                        '                        '+data[index].goods_name+'\n' +
                        '                    </div>\n' +
                        '                    <div class="price">\n' +
                        '                        <strong><em>￥'+data[index].shop_price+'</em></strong><del>￥'+data[index].goods_market_price+'</del>\n' +
                        '                    </div>\n' +
                        '                </div>\n' +
                        '            </a>\n' +
                        '        </div>';

                }
                page = res.data.current_page+1;
                pages = res.data.last_page;

                $(".goods_list").append(html);
                $('.page-content').find('.loading-more').remove();
                console.log("page="+page);
                console.log("pages"+pages);
            }else{
                // dialog_show(res.recode, res.message, [], 3000);
            }

        })
    }

</script>
    <div id="footer" class="page-footer">
        <ul class="footer">
            <li><a id="footer_home" class="nav-controller active " href="/"><i class="fb fb-home"></i>首页</a></li>
           

            <li><a id="footer_personal" class="nav-controller " href="user.html"><i class="fb fb-user"></i>关于拼宠宠</a></li>
        </ul>
    </div>
    
</body>
</html>


